// scss语法
$highlight-color: pink;
$basic-border: 1px solid black;
// 导入base.scss
@import './base.scss';
// 定义mixins
@mixin container {
    width: 1200px;
    background-color: green;
}

@mixin clearfix {
    &:after {
        content: "";
        display: table;
        clear: both;
    }
}
#app {
    background-color: $highlight-color;
    border: $basic-border;
 // 使用mixins
    .container {
        font-size: 30px;
        color: blue;
        .div {
                width: 200px;
                @include clearfix;
                @include container;
            }
    }

    a {
        color: $colorl;
        text-decoration: none;
        &:hover {
            color: blueviolet;
            font-size: 30px;
        }
    }

    p {
        color: $colorl;
        font-size: 25px;
    }
}